﻿<paging:MtPage x:Name="PageRoot"
                     x:Class="SampleWindowsStoreApp.Views.AppBarPage"
                     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                     xmlns:paging="using:MyToolkit.Paging"
                     mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.ChildrenTransitions>
            <TransitionCollection>
                <EntranceThemeTransition/>
            </TransitionCollection>
        </Grid.ChildrenTransitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="120"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Button Margin="39,59,39,0" Command="{Binding Frame.GoBackCommand, ElementName=PageRoot}"
                    Style="{StaticResource NavigationBackButtonNormalStyle}" VerticalAlignment="Top"
                    AutomationProperties.Name="Back" AutomationProperties.AutomationId="BackButton" 
                    AutomationProperties.ItemType="Navigation Button"/>

            <TextBlock Style="{StaticResource SubheaderTextStyle}" Text="Windows 8 and MyToolkit Sample App" Margin="0,50,0,10" Grid.Column="1" />
            <TextBlock Text="App Bar and Command Bar Sample" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1" 
                       TextWrapping="NoWrap" VerticalAlignment="Bottom" Margin="0,100,0,0"/>
        </Grid>

        <StackPanel Grid.Row="1" Margin="120,60,40,40">
            <TextBlock Text="Open the app bar on top or bottom by right-clicking or swiping down or up. " 
                       Style="{StaticResource BasicTextStyle}" Margin="0,0,0,10" />
        </StackPanel>
    </Grid>

    <!-- TopAppBar -->
    <paging:MtPage.TopAppBar>
        <AppBar>
            <StackPanel Orientation="Horizontal">
                <AppBarButton Label="Button 1">
                    <AppBarButton.Icon>
                        <FontIcon FontFamily="Segoe UI Symbol" Glyph="&#xE112;"/>
                    </AppBarButton.Icon>
                </AppBarButton>
                <AppBarButton Label="Button 2">
                    <AppBarButton.Icon>
                        <FontIcon FontFamily="Segoe UI Symbol" Glyph="&#xE112;"/>
                    </AppBarButton.Icon>
                </AppBarButton>

                <!-- Button with Flyout -->
                <AppBarButton Label="Button with Flyout">
                    <AppBarButton.Icon>
                        <FontIcon FontFamily="Segoe UI Symbol" Glyph="&#xE112;"/>
                    </AppBarButton.Icon>
                    <AppBarButton.Flyout>
                        <Flyout>
                            <StackPanel Width="400">
                                <TextBlock Text="Insert the value and tap the Send button:" 
                                           Style="{StaticResource BasicTextStyle}" Foreground="Black"
                                           Margin="0,0,0,10"  />
                                <TextBox />
                                <Button Content="Send" HorizontalAlignment="Right"
                                        Foreground="Black" BorderBrush="Black"
                                        Margin="0,10,0,0" />
                            </StackPanel>
                        </Flyout>
                    </AppBarButton.Flyout>
                </AppBarButton>
            </StackPanel>
        </AppBar>
    </paging:MtPage.TopAppBar>

    <!-- BottomAppBar -->
    <paging:MtPage.BottomAppBar>
        <CommandBar>
            <!-- The available icons can be found here: http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.controls.symbol -->
            
            <CommandBar.PrimaryCommands>
                <AppBarButton Icon="Play" Label="Play" />
                <AppBarSeparator />
                <AppBarButton Icon="Add" Label="Add item" />
            </CommandBar.PrimaryCommands>

            <CommandBar.SecondaryCommands>
                <AppBarButton Label="Edit">
                    <AppBarButton.Icon>
                        <SymbolIcon Symbol="Edit" />
                    </AppBarButton.Icon>
                </AppBarButton>
                <!--<AppBarButton Label="IconButton">
                    <AppBarButton.Icon>
                        <BitmapIcon UriSource="/Assets/MyAppBarIcon.png" />
                    </AppBarButton.Icon>
                </AppBarButton>-->
                <AppBarButton Icon="Globe" Label="Website"></AppBarButton>
            </CommandBar.SecondaryCommands>
        </CommandBar>
    </paging:MtPage.BottomAppBar>
</paging:MtPage>
